<!--
 * @Descripttion: 
 * @Author: yuxi
 * @Date: 2022-09-15 15:27:51
 * @LastEditors: yuxi
 * @LastEditTime: 2022-10-09 21:35:23
--> 
<script>
import TileLayer from './TileLayer.vue'
import Tile from 'ol/layer/Tile';
import XYZ from 'ol/source/XYZ';

export default {
  name: 'MiningXYZLayer',
  mixins: [TileLayer],
  render () { return '' },
  props: {
    url: {
      type: String,
      default () {
        return 'https://tile.openstreetmap.org/{z}/{x}/{y}.png'
      }
    },    
  },
  computed:{
    _url () {
      return this.url
    }
  },
  data() {
    return {
      layer: null
    }
  },
  methods: {
    load () {
      const { map } = this
      this.layer = new Tile({
        source: new XYZ({
          url: this._url
        })
      })
      map.addLayer(this.layer)
      // this.$emit('ready', { map: this.map, layer: this.layer })
    }
  }
}
</script>

<style>
</style>